import React, {
    Component,
} from 'react';
import {
    StyleSheet,
    Text,
    View,
    Dimensions,
    TouchableOpacity,
    Image,
    ScrollView,
    Clipboard
} from 'react-native';
import { ToastToUser } from '../../../../utils/CustomToast';

export default class CarDescriptionBox extends Component {

    render() {
        return (
            <View style={styles.container}>
                <View style={styles.topBox}>
                    {/*<Text style={styles.titleText}>{this.props.name}</Text>*/}
                    <View style={{position: 'relative'}}>
                        <View style={{height:11, width: '100%', backgroundColor: '#FFEE3B', position: 'absolute', left: 0, top: 9}}></View>
                        <Text style={styles.titleText}>{this.props.name}</Text>
                    </View>
                </View>
                <View style={styles.carConditionBox}>
                    <Text style={styles.carConditionText}>{this.props.carCondition}</Text>
                </View>
            </View>
        )
    }

}

const styles = StyleSheet.create({
    container: {
        marginTop: 10,
        marginHorizontal: 8,
        borderRadius: 6,
        flexDirection: 'column',
        backgroundColor: '#fff',
        padding: 16,
    },
    topBox: {
        flexDirection: 'row',
        alignItems: 'center',
        justifyContent: 'space-between'
    },
    titleText: {
        color: '#333',
        fontWeight: 'bold',
        fontSize: 16
    },
    carConditionBox: {
        marginTop: 16,
        padding: 12,
        backgroundColor: '#F9F9F9',
        borderRadius: 4

    },
    carConditionText: {
        color: '#666666',
        fontSize: 14,
        lineHeight: 20
    }
})